<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="《18》综合练习.css" type="text/css">
</head>
<body>
      <div class="top">
          <div class="logo">Logo</div>
          <div class="nav">
              <ul>
                  <li><a href="#home">主页</a></li>
                  <li><a href="#news">新闻</a></li>
                  <li><a href="#contact">联系</a></li>
                  <li ><a href="#about">关于</a></li>
              </ul>
          </div>
          <div class="avatar">
              <img src="demo.jpg">
          </div>
          <div class="search">
              <form action="" method="post">
                  <input type="text" placeholder="搜索">
              </form>
          </div>

      </div>

      <div class="middle">
          <div class="content1">
              <h5>享受生活</h5>
              <p>好好学习daydayup</p>
              <hr>
          </div>
          <div class="content">
              <div class="img">
                  <img src="eg_cute.gif" >
                  <div class="desc">描述图片</div>
              </div>
                  <div class="img">
                      <img src="eg_cute.gif" >
                      <div class="desc">描述图片</div>
                  </div>
              <div class="img">
                  <img src="eg_cute.gif" >
                    <div class="desc">描述图片</div>
              </div>
                  <div class="img">
                      <img src="eg_cute.gif" >
                        <div class="desc">描述图片</div>
                  </div>
          </div>
          <div class="content3">
              <h3>表单</h3>

              <form action="https://www.baidu.com" enctype="multipart/form-data" method="post">
                  <label>用户名：</label><input type="text" placeholder="请输入用户名" required="true"><br/>
                  <label>邮箱：</label><input type="email"><br/> <!--自带简单的表单验证-->
                  <label>密码：</label><input type="password"/><br/>

                  单选：
                  男<input type="radio" name="sex" value="male">
                  女<input type="radio" name="sex" value="female">

                  复选框：
                  体育<input type="checkbox" name="hobby" value="sport">
                  数学<input type="checkbox" name="hobby" value="math">
                  阅读<input type="checkbox" name="hobby" value="reading">
                  英语<input type="checkbox" name="hobby" value="english">
                  <br/>

                  下拉列表
                  <select>
                      <option>学生</option>
                      <option>程序员</option>
                      <option>医生</option>
                  </select>
                  <br/>

                  文本域：
                  <textarea placeholder="请写反馈建议" readonly="true"></textarea>
                  <br/>

                  上传文件：
                  <input type="file">
                  <br/>

                  <input type="reset" value="重置">
                  <input type="submit" value="确认提交">
              </form>
          </div>

      </div>

      <div class="bottom">
          联系我们
          <hr>
      </div>

</body>
</html>